<script id="grid_detailTemp" type="text/x-kendo-template">
    <div class="card mb-3">
        <h5 class="card-header">条件搜索</h5>
        <div class="card-body">
            <form class="condition">
                <div class="form-group row justify-content-lg-center mb-lg-4">
                    <label class="col-form-label text-lg-right col-lg-2 k-label-lg">搜索：</label>
                    <div class="col-lg-4">
                        <span class="k-textbox k-textbox-lg k-space-left w-100"><input id="searchKeywords" name="keywords" type="text" placeholder="请输入关键字并回车……"><a class="k-icon k-i-search k-required" href="javascript:;"></a></span>
                    </div>
                    <div class="col-lg-2 text-center text-lg-left">
                        <button class="k-button k-button-lg k-state-selected mt-3 mt-lg-0" id="searchBtn" type="button" onclick="conditionSearch();">模糊搜索</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
    <div class="card">
        <h5 class="card-header">表格展示</h5>
        <div class="card-body">
            <div id="grid"></div>
        </div>
    </div>
    <script id="detailsTemplate" type="text/x-kendo-template">
        <div class="subTabstrip">
            <ul>
                <li class="k-state-active">子表</li>
                <li>详情</li>
            </ul>
            <div class="p-3">
                <div class="subGrid"></div>
            </div>
            <div class="p-3">
                <div class="row w-30">
                    <div class="col-md-3">
                        <div class="card mb-3">
                            <img class="card-img-top" src="#= photo.url #" alt="[#= kendo.toString(photo.size / 1024, '0.00') # KB]" title="#= id #：#= photo.name ##= photo.extension #">
                            <div class="card-body">
                                <h4 class="card-title">
                                    # if (gender === '1') { #
                                        <i class="fas fa-mars mars"></i>
                                    # } else if (gender === '2') { #
                                        <i class="fas fa-venus venus"></i>
                                    # } #
                                    <strong class="text-dark">#= realName #</strong>
                                    <small class="text-black-50">[#= nickName #]</small>
                                </h4>
                                <p class="card-text">
                                    <span class="mr-2">#= userName #</span>
                                    # if (online) { #
                                        <span class="dot-color k-notification-success"></span><span class="k-notification-success bg-transparent ml-2">在线</span>
                                    # } else { #
                                        <span class="dot-color k-notification-error"></span><span class="k-notification-error bg-transparent ml-2">离线</span>
                                    # } #
                                </p>
                                <p class="card-text">#= sign #</p>
                                <p class="card-text">#= summary #</p>
                            </div>
                            <ul class="list-group list-group-flush">
                                <li class="list-group-item">
                                    <strong>年龄：</strong>
                                    #= age # 岁
                                </li>
                                <li class="list-group-item">
                                    <strong>身高：</strong>
                                    #= kendo.toString(height, '0.00') # m
                                </li>
                                <li class="list-group-item">
                                    <strong>血型：</strong>
                                    # if (bloodType === '1') { #
                                        A 型
                                    # } else if (bloodType === '2') { #
                                        B 型
                                    # } else if (bloodType === '3') { #
                                        O 型
                                    # } else if (bloodType === '4') { #
                                        AB 型
                                    # } else if (bloodType === '5') { #
                                        其他
                                    # } #
                                </li>
                                <li class="list-group-item">
                                    <strong>生日：</strong>
                                    #= birthday #
                                </li>
                                <li class="list-group-item">
                                    <strong>生肖：</strong>
                                    #= zodiac.zodiacName #
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-md-9">
                        <div class="card mb-3">
                            <h5 class="card-header">家庭情况</h5>
                            <div class="card-body">
                                <div class="row">
                                    <p class="col-md-6">
                                        <strong>配偶生日：</strong>
                                        #= mateBirthday #
                                    </p>
                                    <p class="col-md-6">
                                        <strong>民族：</strong>
                                        #= nation.nationName #
                                    </p>
                                    <p class="col-md-6">
                                        <strong>籍贯：</strong>
                                        #= nativePlace.provinceName # - #= nativePlace.cityName # - #= nativePlace.areaName #
                                    </p>
                                    <p class="col-md-6">
                                        <strong>居住地：</strong>
                                        #= domicile.name #
                                    </p>
                                    <p class="col-md-6">
                                        <strong>银行卡：</strong>
                                        #= creditCard.replace(creditCard.substr(2, 12), '** **** **** **') #
                                    </p>
                                    <p class="col-md-6">
                                        <strong>资产：</strong>
                                        #= kendo.toString(asset, 'c') #
                                    </p>
                                </div>
                            </div>
                        </div>
                        <div class="card mb-3">
                            <h5 class="card-header">教育情况</h5>
                            <div class="card-body">
                                <div class="row">
                                    <p class="col-md-6">
                                        <strong>语言：</strong>
                                        #= language #
                                    </p>
                                    <p class="col-md-6">
                                        <strong>教育程度：</strong>
                                        # for (var i = 0; i < education.length; i++) { #
                                            # if (education[i] === '1') { #
                                                小学&nbsp;
                                            # } else if (education[i] === '2') { #
                                                初中&nbsp;
                                            # } else if (education[i] === '3') { #
                                                高中&nbsp;
                                            # } else if (education[i] === '4') { #
                                                中专&nbsp;
                                            # } else if (education[i] === '5') { #
                                                大专&nbsp;
                                            # } else if (education[i] === '6') { #
                                                本科&nbsp;
                                            # } else if (education[i] === '7') { #
                                                硕士&nbsp;
                                            # } else if (education[i] === '8') { #
                                                博士&nbsp;
                                            # } else if (education[i] === '9') { #
                                                其他&nbsp;
                                            # } #
                                        # } #
                                    </p>
                                    <p class="col-md-6">
                                        <strong>毕业年份：</strong>
                                        #= graduation #
                                    </p>
                                    <p class="col-md-6">
                                        <strong>参加工作年月：</strong>
                                        #= firstJob #
                                    </p>
                                </div>
                            </div>
                        </div>
                        <div class="card mb-3">
                            <h5 class="card-header">联系方式</h5>
                            <div class="card-body">
                                <div class="row">
                                    <p class="col-md-6">
                                        <strong>手机：</strong>
                                        #= mobile #
                                    </p>
                                    <p class="col-md-6">
                                        <strong>电子邮件：</strong>
                                        #= email #
                                    </p>
                                    <p class="col-md-12">
                                        <strong>个人主页：</strong>
                                        #= homepage #
                                    </p>
                                </div>
                            </div>
                        </div>
                        <div class="card">
                            <h5 class="card-header">个性介绍</h5>
                            <div class="card-body">
                                <div class="row">
                                    <p class="col-md-6">
                                        <strong>起床时间：</strong>
                                        #= getUp #
                                    </p>
                                    <p class="col-md-6">
                                        <strong>最有意义的时刻：</strong>
                                        #= importantMoment #
                                    </p>
                                    <p class="col-md-6">
                                        <strong>性格：</strong>
                                        # if (character === 10) { #
                                            超级开朗
                                        # } else if (character === 8) { #
                                            非常开朗
                                        # } else if (character === 6) { #
                                            很开朗
                                        # } else if (character === 4) { #
                                            比较开朗
                                        # } else if (character === 2) { #
                                            有点开朗
                                        # } else if (character === 0) { #
                                            普通
                                        # } else if (character === -2) { #
                                            有点内向
                                        # } else if (character === -4) { #
                                            比较内向
                                        # } else if (character === -6) { #
                                            很内向
                                        # } else if (character === -8) { #
                                            非常内向
                                        # } else if (character === -10) { #
                                            超级内向
                                        # } #
                                    </p>
                                    <p class="col-md-6">
                                        <strong>颜色喜好：</strong>
                                        <span style="display: inline-block; width: 60%; height: 24px; background: #= color #; border: 1px solid \#c5c5c5; border-radius: 4px; vertical-align: middle;"></span>
                                    </p>
                                    <p class="col-md-6">
                                        <strong>相配的星座：</strong>
                                        # for (var i = 0; i < constellation.length; i++) { #
                                            # if (constellation[i] === "1") { #
                                                白羊座&nbsp;
                                            # } else if (constellation[i] === "2") { #
                                                金牛座&nbsp;
                                            # } else if (constellation[i] === "3") { #
                                                双子座&nbsp;
                                            # } else if (constellation[i] === "4") { #
                                                巨蟹座&nbsp;
                                            # } else if (constellation[i] === "5") { #
                                                狮子座&nbsp;
                                            # } else if (constellation[i] === "6") { #
                                                处女座&nbsp;
                                            # } else if (constellation[i] === "7") { #
                                                天秤座&nbsp;
                                            # } else if (constellation[i] === "8") { #
                                                天蝎座&nbsp;
                                            # } else if (constellation[i] === "9") { #
                                                射手座&nbsp;
                                            # } else if (constellation[i] === "10") { #
                                                山羊座&nbsp;
                                            # } else if (constellation[i] === "11") { #
                                                水瓶座&nbsp;
                                            # } else if (constellation[i] === "12") { #
                                                双鱼座&nbsp;
                                            # } #
                                        # } #
                                    </p>
                                    <p class="col-md-6">
                                        <strong>旅游足迹：</strong>
                                        # for (var i = 0; i < tourism.length; i++) { #
                                            #= tourism[i].name #&nbsp;
                                        # } #
                                    </p>
                                    <p class="col-md-6">
                                        <strong>自我评价：</strong>
                                        # if (evaluation === 1) { #
                                            不合格
                                        # } else if (evaluation === 2) { #
                                            待提升
                                        # } else if (evaluation === 3) { #
                                            合格
                                        # } else if (evaluation === 4) { #
                                            良好
                                        # } else if (evaluation === 5) { #
                                            优秀
                                        # } else if (evaluation === 6) { #
                                            完美
                                        # } #
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </script>
</script>